<!DOCTYPE html>
<html lang=“en”>
<head>
<meta charset="UTF-8">
<title>计算属性，方法，侦听器</title>
<script src='./vue.js'></script>
</head>
<body>
<div id="app">{{fullName}}</div>
 
<script>
var vm=new Vue({
el:"#app",
data:{
firstName:"西柚",
lastName:"许",
},
/*computed:{//缓存，若依赖的值不变，计算属性就不会再计算
fullName:function(){
return this.firstName+" "+this.lastName;
}
}*/
computed:{//缓存，若依赖的值不变，计算属性就不会再计算
fullName:{
get:function(){
return this.firstName+" "+this.lastName;
},
set:function(value){
console.log(value);
}
}
}
/*methods:{
full:function(){//不如计算属性好用，页面只要重新加载就会执行一次函数，没有缓存机制
return this.firstName+" "+this.lastName}
}
watch:{
firstName:function(){
this.fullName=this.firstName+" "+this.lastName;
},
lastName:function(){
this.fullName=this.firstName+" "+this.lastName;
}
}*/

})
</script>
</body>